<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, min imum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>购物车</title>
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/cart.css">
    <script src="../js/moveapp.js"></script>
    <link rel="icon" href="../images/logo.png" style="width: 6px; height: 6px;">

</head>
<body>
    <header>
        <a href="../index.html"><img src="../images/下载.png" alt=""></a>
        <div class="title">购物车</div>
        <a href=""><img src="../images/下载 (1).png" alt=""></a>
    </header>
    <main>
        <form action="">
            <div class="store">
                <input type="checkbox" name="all" id="all">
                <label for="all">小米自营</label>
                <span>已免运费</span>
            </div>
            <div class="goods">
                <input type="checkbox" name="xiaomi11" id="xiaomi11" checked>
                    <!-- <label for="xiaomi11"></label> -->
                <div class="goods-top">
                    <div class="pic-price">
                        <div>
                            <img src="../images/购物车-商品.jpg" alt="">
                        </div>
                        <div class="price">
                            <pre>Xiaomi 11 青春版</pre>
                            <pre>8GB+128GB 清凉薄荷</pre>
                            <pre>售价：1999元</pre>
                            <div class="up-down">
                                <div>
                                    <img src="../images/下载 (4).png" alt="">
                                </div>
                                <span>1</span>
                                <div>
                                    <img src="../images/下载 (5).png" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="delete">
                        <img src="../images/下载 (6).png" alt="">
                    </div>
                </div>
                <div class="protect">
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                </div>
            </div>
            <div class="goods">
                <input type="checkbox" name="xiaomi11" id="xiaomi11">
                    <!-- <label for="xiaomi11"></label> -->
                <div class="goods-top">
                    <div class="pic-price">
                        <div>
                            <img src="../images/购物车-商品.jpg" alt="">
                        </div>
                        <div class="price">
                            <pre>Xiaomi 11 青春版</pre>
                            <pre>8GB+128GB 清凉薄荷</pre>
                            <pre>售价：1999元</pre>
                            <div class="up-down">
                                <div>
                                    <img src="../images/下载 (4).png" alt="">
                                </div>
                                <span>1</span>
                                <div>
                                    <img src="../images/下载 (5).png" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="delete">
                        <img src="../images/下载 (6).png" alt="">
                    </div>
                </div>
                <div class="protect">
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                    <div class="protect-item">
                        <img src="../images/购物车-保.png" alt="">
                        <pre>意外保护 179元起</pre>
                        <a href="">选购</a>
                    </div>
                </div>
            </div>
            <div class="tips">
                <span>温馨提示：产品是否购买成功，以最终下单为准，请尽快结算</span>
            </div>
            <footer>
                <div class="money">
                   <pre>共1件 金额</pre>
                   <pre><span>1999</span>元</pre>
                </div>
                <div class="continue">继续购物</div>
                <button>去结算</button>
            </footer> 
        </form>
        <div class="recommend">
            <div class="recommend-top">
                <img src="../images/购物车-商品推荐.png" alt="">
            </div>
            <div class="product">
                <div class="product-item">
                    <div class="product-item-small">
                        <img src="../images/购物车-手机1.jpg" alt="">
                        <div class="small-price">
                            <pre>Xiaomi 11</pre>
                            <span>¥4999</span>
                        </div>
                    </div>
                    <div class="product-item-small">
                        <img src="../images/购物车-电饭煲.jpg" alt="">
                        <div class="small-price">
                            <pre>米家电饭煲C1</pre>
                            <span>¥999</span>
                        </div>
                    </div>
                </div>
                <div class="product-item">
                    <div class="product-item-small">
                        <img src="../images/购物车-手机1.jpg" alt="">
                        <div class="small-price">
                            <pre>Xiaomi 11</pre>
                            <span>¥4999</span>
                        </div>
                    </div>
                    <div class="product-item-small">
                        <img src="../images/购物车-电饭煲.jpg" alt="">
                        <div class="small-price">
                            <pre>米家电饭煲C1</pre>
                            <span>¥999</span>
                        </div>
                    </div>
                </div>
                <div class="product-item">
                    <div class="product-item-small">
                        <img src="../images/购物车-手机1.jpg" alt="">
                        <div class="small-price">
                            <pre>Xiaomi 11</pre>
                            <span>¥4999</span>
                        </div>
                    </div>
                    <div class="product-item-small">
                        <img src="../images/购物车-电饭煲.jpg" alt="">
                        <div class="small-price">
                            <pre>米家电饭煲C1</pre>
                            <span>¥999</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
</body>
</html>